@import '../../../styles/mixins.scss';
@import '../../../styles/extends.scss';
@import '../../../styles/input.extends.scss';
@import '../../../styles/buttons.extends.scss';
@import '../../../styles/animation.scss';

.container {
  @apply
  h-full
  w-1/2
  rounded-lg
  flex
  flex-col
  gap-2
  justify-between;

  .header {
    @apply
    w-full
    h-fit;

    h5 {
      @apply 
      w-full
      text-base
      text-center
      font-bold
      uppercase
      text-myTheme-light;
    }
  }

  .body {
    @apply
    h-72
    py-2
    px-1
    m-0
    flex
    flex-col
    justify-between
    rounded-lg
    bg-myTheme-primary
    text-xs;

    .body__placeholder {
      @apply
      h-fit
      text-center
      uppercase
      overflow-hidden
      text-myTheme-light;
    }

    .body__table {
      @apply
      h-64
      w-full
      overflow-hidden
    text-myTheme-light;

      .table__title {
        @apply 
        px-1
        flex
        flex-row
        gap-1
        justify-between
        pt-1
        pb-2
        border-b
        border-y-myTheme-dark;
        
        .title__bottom {
          @extend %small-button-dark;
          @apply w-4 h-4
          bg-myTheme-primary;
        }
      }

      .body__list {
        @apply
        py-1
        h-fit
        w-full
        border-b
        border-y-myTheme-dark
        list-inside
        list-disc
        text-nowrap
        overflow-hidden
        text-ellipsis;
      }
    }
  }

  .footer {
    @apply
    w-full
    h-fit
    flex
    flex-row
    justify-between
    px-2;

    .footer__pagination {
      @apply
      h-fit
      w-fit
      flex
      flex-row;

      .pagination__text {
        @apply
        flex
        items-center
        justify-center
        w-12;

        p {
          @apply
          w-fit
          text-xs
          text-myTheme-accent
          scale-90;
        }
      }
    }

    .footer__bottom {
      @extend %small-button-ligth;
    }

    .footer__bottom_disable {
      @extend %small-button-disable;
    } 
  }
}